<template>
	<view class="content poRel">
		<view style="height: 30rpx;"></view>
		<view class="wid90 mar">
			<view class="fowe800 foSi30">订单编号</view>
			<view class="mar-top30 borRad10" style="background-color: #EEEEEE;color: #5B5B5B;">
				<view class="dis disAl disJuB wid90 mar" style="height: 96rpx;">
					<view class="foSi30">关联订单</view>
					<picker class="foSi25" @change="indentChange" :value="indentIndex" :range="indentList">
						<view class="dis disAl">
							<view v-if="indentIndex" class="mar-right10">{{indentList[indentIndex].name}}</view>
							<view v-if="!indentIndex" class="mar-right10" style="color: #4B4A4A;">请选择</view>
							<uni-icons type="right" size="25rpx"></uni-icons>
						</view>
					</picker>
				</view>
			</view>
			<view class="fowe800 foSi30 mar-top30">申诉理由</view>
			<view class="mar-top30 borRad10" style="background-color: #EEEEEE;padding: 30rpx 0;">
				<textarea class="wid90 mar foSi30" :maxlength="1000" v-model="text" 
					style="height: 200rpx;" placeholder-style="color: #5B5B5B" placeholder="请输入申诉理由"/>
				<view class="wid90 mar foSi25 mar-top15" style="text-align: right;color: #5B5B5B;">{{text.length}}/1000</view>
			</view>
		</view>
		<view style="height: 140rpx;"></view>
		<view class="poFix wid100 bacFFF" style="height: 120rpx;bottom: 0;">
			<view class="dis disAl disJuC wid90 mar hei100">
				<!-- <view class="hei86 dis disAl disJuC borRad40 foSi30 fowe600" style="width: 300rpx;border: 2rpx solid #BFBFBF;">反馈记录</view> -->
				<view class="hei86 dis disAl disJuC borRad40 coFFF foSi30 fowe600 wid100" @click="fankui"
					:style="'background :'+theme.main_color+';'">提交申诉</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: this.global.url,
				indentList: [],
				indentIndex: null,
				text: '',
				order_id: null,
				theme: null
			}
		},
		onLoad() {
			this.theme = uni.getStorageSync('theme')
		},
		methods: {
			getList(){
				var that = this;
				uni.request({
					url: that.global.url + 'api/qianyu_smfw/tech/splitting_details',
					method: "POST",
					header: {
						'site-id': that.global.site_id, //自定义请求头信息
						'token': uni.getStorageSync('token')
					},
					data: {},
					success(res) {
						let result = res.data
						if (result.code == 1) {
							that.list = result.data.data
						}else{
							uni.showToast({
								title: result.msg,
								//将值设置为 success 或者直接不用写icon这个参数
								icon: 'error',
								//显示持续时间为 2秒
								duration: 2000
							}) 
						}
					}
				})
				
			},
			fankui(){
				var that = this;
				if(!that.text){return uni.showToast({title: '请输入问题',icon: 'error',duration: 2000}) }
				if(!that.order_id){return uni.showToast({title: '请输入关联订单',icon: 'error',duration: 2000}) }
				uni.request({
					url: that.global.url + 'api/qianyu_smfw/feedback/apply_info',
					method: "POST",
					header: {
						'site-id': that.global.site_id, //自定义请求头信息
						'token': uni.getStorageSync('token')
					},
					data: {
						order_id: that.order_id,
						content: that.text,
					},
					success(res) {
						let result = res.data
						if (result.code == 1) {
							uni.navigateBack(1)
						}else{
							uni.showToast({
								title: result.msg,
								//将值设置为 success 或者直接不用写icon这个参数
								icon: 'error',
								//显示持续时间为 2秒
								duration: 2000
							}) 
						}
					}
				})
				
			},
			indentChange: function(e) {
				if(this.indentChange.length > 0){
					this.indentIndex = e.detail.value
					this.order_id = this.indentList[this.indentIndex].id
				}
			},
			tiaozhuan(url) {
				uni.navigateTo({
					url: url
				})
			}
		}
	}
</script>

<style>
	.content {
		min-height: 100vh;
	}
</style>